<!DOCTYPE html>
<!-- 打卡界面 -->
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>打卡</title>
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/iconfont.css">
</head>
<body>
    <header>
        <p class="active_title">正在进行 [ 英语六级猛冲集训 ] 打卡</p>
        <p class="active_num">1200人参与|空 10000 次打卡</p>
    </header>
    <section>
        <!-- 功能区 -->
        <div class="fun">
            <p>
                <span class="iconfont icon-rili"></span>
                <span>日历</span>
            </p>
            <p>
                <span class="iconfont icon-paihangbang"></span>
                <span>排行榜</span>
            </p>
        </div>
        <!-- 功能区 -->
        <!-- 打卡模块 -->
        <div class="content">
            <div class="content_week">
                <div>日</div>
                <div>一</div>
                <div>二</div>
                <div>三</div>
                <div>四</div>
                <div>五</div>
                <div>六</div>
            </div>
            <div class="content_day">
                <div><p>26</p></div>
                <div><p>27</p></div>
                <div><p class="day_active">28</p></div>
                <div><p>29</p></div>
                <div><p>30</p></div>
                <div><p>31</p></div>
                <div><p>1</p></div>
                <div><p>2</p></div>
                <div><p>3</p></div>
                <div><p>4</p></div>
                <div><p>5</p></div>
                <div><p>6</p></div>
                <div><p>7</p></div>
                <div><p>8</p></div>
                <div><p>9</p></div>
                <div><p>10</p></div>
                <div><p>11</p></div>
                <div><p>12</p></div>
                <div><p>13</p></div>
                <div><p>14</p></div>
                <div><p>15</p></div>
                <div><p>16</p></div>
                <div><p>17</p></div>
                <div><p>18</p></div>
                <div><p>19</p></div>
                <div><p>20</p></div>
                <div><p>21</p></div>
                <div><p>22</p></div>
                <div><p>23</p></div>
                <div><p>24</p></div>
                <div><p>25</p></div>
                <div><p>26</p></div>
                <div><p>27</p></div>
                <div><p>28</p></div>
                <div><p>29</p></div>
            </div>
            <div class="content_btn">
                打卡
            </div>
            <div class="content_footer">
                <p>已坚持打卡28天</p>
                <p>有效打卡时间：06:00:00·23:59:59</p>
            </div>
        </div>
        <!-- 打卡模块 -->
    </section>
    <footer>
        <a href="#" title="主页" class="footer_active">
            <span class="iconfont icon-zhuye"></span>
            <p>主页</p>
        </a>
        <a href="#" title="图文">
            <span class="iconfont icon-wenzhang-copy"></span>
            <p>图文</p>
            
        </a>
        <a href="#" title="个人中心">
            <span class="iconfont icon-gerenzhongxin"></span>
            <p>个人中心</p>
        </a>
    </footer>
</body>
</html>